<template>
  <el-dialog :title="title"  :visible="visible" :close-on-click-modal="false"
             :before-close="handleClose" width="500px">
  <el-form ref="form" :model="teacher" :rules="rules" label-width="90px" style="width: 800px">
    <el-form-item label="姓名"  prop="teachername" style="width:400px">
    <el-input  v-model="teacher.teachername"></el-input>
    </el-form-item>
    <el-form-item label="手机"  prop="tel" style="width:400px">
    <el-input  v-model="teacher.tel"></el-input>
    </el-form-item>
    <el-form-item label="邮箱"  prop="email" style="width:400px">
    <el-input  v-model="teacher.email"></el-input>
    </el-form-item>
    <el-form-item label="性别"  prop="sex">
         <el-radio v-model="teacher.sex" style="margin-right:200px" label="男">男</el-radio>
         <el-radio v-model="teacher.sex" style="margin-right:400px" label="女">女</el-radio>
    </el-form-item>
 
    <el-form-item label="教学经历"  prop="experience" style="width:400px">
        <el-input type="textarea" :autosize="{ minRows: 2, maxRows: 4}" maxlength="150" show-word-limit v-model="teacher.experience"></el-input>
    </el-form-item>

    <el-form-item label="教学经历"  prop="field" style="width:400px">
        <el-input type="textarea" :autosize="{ minRows: 2, maxRows: 4}" maxlength="150" show-word-limit v-model="teacher.field"></el-input>
    </el-form-item>
    </el-form>
    <span slot="footer" class="dialog-footer">
      <el-button type="text" @click="handleClose">取 消</el-button>
      <el-button type="primary" @click="handleSubmit"
                 :loading="loading">{{loading?'提交中...':'保存修改'}}</el-button>
    </span>
  </el-dialog>
</template>
<script>

import {select,add} from '@/api/modules/teacher_infor'
import {getCookie} from '@/libs/cookie'

export default {
    name:'student_infor',
    props: {
      visible: {
        type: Boolean
      },
      title: {
        type: String,
        default: '办理入住'
      },
      defaultFormData: {
        type: Object
      },
    },
    data(){
        return{
            teacher:{},
            user:{
                id:''
            },
               loading: false,
            rules:{
                teachername:{required: true, message: "姓名不能为空", trigger: "blur"},
                sex: {required: true, message: "性别不能为空", trigger: "blur"},
                experience: {required: true, message: "教学经历不能为空", trigger: "blur"},
                field: {required: true, message: "教学领域不能为空", trigger: "blur"},
                tel: [
                    {min: 11,max: 11,message: '电话号码格式不正确'},
                    {validator:function(rule,value,callback){
                    if(/^1[34578]\d{9}$/.test(value) == false){
                        callback(new Error("请输入正确的手机号"));
                    }else{
                        callback();
                    }
                     }, trigger: 'blur'}

                ],
                email: [
                    {validator:function(rule,value,callback){
                    if(/^([a-zA-Z0-9_-])+@([a-zA-Z0-9_-])+(.[a-zA-Z0-9_-])+/.test(value) == false){
                        callback(new Error("请输入正确的邮箱"));
                    }else{
                        callback();
                    }
                    }, trigger: 'blur'}
                ]
            }
        }
    },
    mounted(){
          if (JSON.stringify(this.defaultFormData) == "{}") {

         }else{
         let formData = this.clone(this.defaultFormData)
         this.teacher = JSON.parse(JSON.stringify(formData))
         //console.log(this.teacher)
       }
    },
    methods:{
      
   handleClose() {
        this.$emit('close', this.refresh)
      },
      handleSubmit() {
        this.$refs.form.validate(valid => {
          if (valid) {

            this.loading = true
              add({
                ...this.teacher
              }).then(res => {
              
                this.loading = false
                if (res.success) {
                  this.refresh = true
                  this.toast(res.message)
                  this.handleClose()
                }
              })
          }
        })
      }
    }
}
</script>

